<template>
  <div>
    <homeheader></homeheader>
    <homeswiper :slist="swiperList"></homeswiper>
    <homeicons :ilist="iconList"></homeicons>
    <hometop :tlist="topList"></hometop>
    <homerecommend :rlist="recommendList"></homerecommend>
    <homeweekend :wlist="weekendList"></homeweekend>
  </div>
</template>

<script>
import home_header from './compnent/header.vue'
import home_swiper from './compnent/swiper.vue'
import home_icons from './compnent/icons.vue'
import home_top from './compnent/top.vue'
import home_recommend from './compnent/recommend.vue'
import home_weekend from './compnent/weekend.vue'
import axios from 'axios'
import { mapState } from 'vuex'
export default {
  name:'Home',
  components:{
    homeheader:home_header,
    homeswiper:home_swiper,
    homeicons:home_icons,
    homerecommend:home_recommend,
    hometop:home_top,
    homeweekend:home_weekend
  },
  data () {
    return{
      lastCIty: '',
      swiperList:[],
      iconList:[],
      topList:[],
      recommendList:[],
      weekendList:[]

    }
  },
  computed: {
    ...mapState(['city'])
  },
  methods: {
    getHomeInfo () {
      axios.get('/static/mock/index.json?city=' + this.city)
        .then(this.getHomeInfoSucc)
    },
    getHomeInfoSucc (res) {
      res = res.data
      if(res.ret && res.data){
        const info=res.data
        this.swiperList = info.swiperList
        this.iconList = info.iconList
        this.topList = info.topList
        this.recommendList = info.recommendList
        this.weekendList = info.weekendList

      }
    }
  },
  mounted () {
    this.lastCIty = this.city
    this.getHomeInfo()
  },
  activated () {
    if (this.lastCIty !== this.city) {
      this.lastCIty = this.city
      this.getHomeInfo()
    }
  }

}
</script>

<style>

</style>

